// component/dropdown-menu/dropdown-menu.js
Component({
    /**
     * 组件的属性列表
     */
    options: {
        multipleSlots: true // 在组件定义时的选项中启用多slot支持
    },
    properties: {
        menuTitleList: { //菜单标题列表
            type: Array,
            value: ['菜单1', '菜单2', '菜单3']
        },
        show: { //弹出层是否[可以]显示
            type: Boolean,
            value: true
        },
        height: { //高度
            type: String,
            value: '488rpx'
        }
    },
    observers: {
        'show': function(show) {
            if (!show) {
                this.setData({
                    isFiltering: false,
                    selectedIndex: -1
                })
            }
        }
    },

    /**
     * 组件的初始数据
     */
    data: {
        //orign
        isFiltering: false, //是否正在筛选
        selectedIndex: -1

        // //test
        // isFiltering: true, //是否正在筛选
        // selectedIndex: 1
    },

    /**
     * 组件的方法列表
     */
    methods: {
        tapTitle(e) {
            //在展开形式再点同一个菜单，菜单会收起
            if (this.data.selectedIndex == e.currentTarget.dataset.index) {
                this.setData({
                    isFiltering: false,
                    selectedIndex: -1
                })
            }
            //否则，菜单都会打开，并更新selectedIndex
            else {
                this.setData({
                    isFiltering: true,
                    selectedIndex: e.currentTarget.dataset.index
                })
            }

        },
        tapMask() {
            this.setData({
                isFiltering: false,
                selectedIndex: -1
            })
        }
    }
})